.d-box1 {
  width: 100%;
  height: 100%;
  display: flex;
  justify-content: center;
  align-items: center;
}
.d-box2 {
  width: 1184px;
  height: 100%;
  display: flex;
  flex-direction: column;
  box-sizing: border-box;
  padding: 70px 0 106px 0;
  gap: 20px 0;
  overflow-y: scroll;
}
.d-box2::-webkit-scrollbar {
  display: none;
}
.d-right {
  width: 100%;
  display: flex;
  flex-direction: row-reverse;
  gap: 0 4px;
}
.d-left {
  width: 100%;
  display: flex;
  gap: 0 4px;
}
.d-right-style {
  margin-top: 20px;
  min-width: 30%;
  max-width: 80%;
  min-height: 40px;
  padding: 1em;
  white-space: pre-wrap;
  box-sizing: border-box;
}
.d-left-style {
  margin-top: 20px;
  min-width: 30%;
  max-width: 80%;
  min-height: 40px;
  padding: 0 1em;
  box-sizing: border-box;
}
.d-box3 {
  width: 40px;
  height: 100%;
}
.d-img1 {
  width: 40px;
  height: 40px;
  border-radius: 3px;
}
@media screen and (max-width: 1300px) {
  .d-box2 {
    width: 70%;
    padding: 85px 0 85px 0;
  }
}

@media screen and (max-width: 1100px) {
  .d-box2 {
    width: 80%;
    padding: 80px 0 80px 0;
  }
}
@media screen and (max-width: 900px) {
  .d-box2 {
    width: 90%;
    padding: 75px 0 75px 0;
  }
}
@media screen and (max-width: 800px) {
  .d-box2 {
    width: 95%;
    padding: 70px 0 70px 0;
  }
}
@media screen and (max-width: 600px) {
  .d-box2 {
    width: 99%;
    padding: 65px 0 70px 0;
  }
}
